import { createContext, useContext, useEffect, useReducer, useState } from 'react';
import { initialQuery } from './contact-helper';

const PageContext = createContext<any>(null);
export function usePageContext() {
  return useContext(PageContext);
}
export const ContactConsumer = PageContext.Consumer;

const ContactProvider = ({ PageEvents, children }: any) => {
  const [showSider, setShowSider] = useState(false);
  const [showFloater, setShowFloater] = useState(false);
  const [queryParams, setQueryParams] = useState(initialQuery);

  const value = {
    showSider,
    setShowSider,
    showFloater,
    setShowFloater,
    queryParams,
    setQueryParams,
    addRecord: PageEvents.addRecord,
    editRecord: PageEvents.editRecord,
    delRecord: PageEvents.delRecord,
    detailRecord: PageEvents.detailRecord,
  };

  return <PageContext.Provider value={value}>{children}</PageContext.Provider>;
};

const StoreContext = createContext<any>(null);
export function useStoreContext() {
  return useContext(StoreContext);
}
export const StoreConsumer = StoreContext.Consumer;

const ContactStoreProvider = ({ store, children }: any) => {
  return (
    <StoreContext.Provider value={store}>{children}</StoreContext.Provider>
  );
};

export { ContactProvider, ContactStoreProvider };

